import React, { Component } from 'react';
import {
    Form, Row, Col, Input, Button, Icon,
  } from 'antd';

import  '../static/css/UserSearchForm.css'

  class UserSearchForm extends Component {
      constructor(props) {
          super(props);
          this.state = {  };
      }
    
      render() {

        const { getFieldDecorator } = this.props.form;

        return (
            // className="ant-advanced-search-form" 
          <Form onSubmit={this.handleSearch}>
          
            {/* <Row> */}
                <Col span={6}>
                    <Form.Item label='ID' key='1' labelCol={{ span: 3 }} wrapperCol={{ span: 21}} >
                        {getFieldDecorator('id', {
                            rules: [{
                                required: false,
                                message: 'Input something!',
                            }],
                            })(
                        <Input placeholder="ID" />
                        )}
                    </Form.Item>

                </Col>
       
                <Col span={6}>
                    <Form.Item label='姓名' key='2' labelCol={{ span: 4 }} wrapperCol={{ span: 20}}>
                    {
                        getFieldDecorator('username', {
                            rules: [{
                                required: false,
                                message: 'Input something!',
                            }],
                        })(
                        <Input placeholder="姓名" />
                        )
                    }
                    </Form.Item>
                </Col>
                <Col span={6}>
                    <Form.Item label='电话' key='2' labelCol={{ span: 4 }} wrapperCol={{ span: 20}}>
                    {
                        getFieldDecorator('phone', {
                            rules: [{
                                required: false,
                                message: 'Input something!',
                            }],
                        })(
                        <Input placeholder="电话" />
                        )
                    }
                    </Form.Item>
                </Col>
        
                {/* <Col span={6} style={{ textAlign: 'left' }}>
                    <Button style={{ marginLeft: 8 ,marginTop: 4 }} type="primary" htmlType="submit">查询</Button>
                    <Button style={{ marginLeft: 8 ,marginTop: 4}} onClick={this.handleReset}>
                        重置
                    </Button>
                </Col> */}
            {/* </Row> */}
          </Form>
        );
      }





  }
  
  export default Form.create()(UserSearchForm);